<template>
    <el-row>
        <el-form class="detail-form">
            <el-col v-for="(data,index) of dataList" :key="index" :span="data.span?data.span:12">
                <el-form-item :label="data.label" :label-width="data.lableWidth?data.lableWidth:'120px'">
                    <span v-if="data.type == null || data.type == 'text'">{{data.value}}</span>
                    <!--多个文件-->
                    <file-download v-if="data.type == 'file' && Array.isArray(data.value)" v-for="(fileId,index) of data.value" :key="index" :file-id="fileId"></file-download>
                    <!--单个文件-->
                    <file-download v-if="data.type == 'file' && !Array.isArray(data.value)" :file-id="data.value"></file-download>
                </el-form-item>
            </el-col>
        </el-form>
    </el-row>
</template>

<script>
    import fileDownload from '@/components/file/download'

    export default {
        name: "detailForm",
        components: {
            fileDownload
        },
        props: {
            dataList: {
                type: Array,
                required: true
            }
        }
    };
</script>

<style lang="scss" scoped>
    .detail-form {
        margin: 10px;
        /deep/ .el-form-item {
            .el-form-item__label {
                font-size: 16px;
                color: #303133;
                font-weight: 600;
            }
            .el-form-item__content {
                font-size: 16px;
            }
        }
    }
</style>